<!DOCTYPE html>
<html lang="en">
<head>
	<meta charset="UTF-8">
	<title>一个愉快的检验方式</title>
	<style>
		html { background: #000; }
	</style>
</head>
<body>

<script>
	// requestAnim shim layer by Paul Irish
	window.requestAnimFrame = (function(){
		return  window.requestAnimationFrame   ||
				window.webkitRequestAnimationFrame ||
				window.mozRequestAnimationFrame    ||
				window.oRequestAnimationFrame      ||
				window.msRequestAnimationFrame     ||
				function(/* function */ callback, /* DOMElement */ element){
					window.setTimeout(callback, 1000 / 60);
				};
	})();


	// example code from mr doob : http://mrdoob.com/lab/javascript/requestanimationframe/

	var canvas, context, toggle;

	init();
	animate();

	function init() {

		canvas = document.createElement( 'canvas' );
		canvas.width = 512;
		canvas.height = 512;

		context = canvas.getContext( '2d' );

		document.body.appendChild( canvas );

	}

	function animate() {
		requestAnimFrame( animate );
		draw();

	}

	function draw() {

		var time = new Date().getTime() * 0.002;
		var x = Math.sin( time ) * 192 + 256;
		var y = Math.cos( time * 0.9 ) * 192 + 256;
		toggle = !toggle;

		context.fillStyle = toggle ? 'rgb(200,200,20)' :  'rgb(20,20,200)';
		context.beginPath();
		context.arc( x, y, 10, 0, Math.PI * 2, true );
		context.closePath();
		context.fill();

	}

</script>
</body>
</html>